<template>
    <div class="search">
        <el-tag class="tag" v-show="tag!=undefined">{{tag}}</el-tag>
        <el-cascader :style="{'width':width,'margin-left':tag!=undefined?'-7px':'0'}" size="small" v-model="myValue"
         :options="orglist" :props="props" :show-all-levels="false" :disabled="isDisabled" collapse-tags clearable :placeholder="placeholder" @change="change">
        </el-cascader>
    </div>
</template>
<script>
import { fetchTraceOrgan, fetchOrgan } from '@/api/system'
    // 下拉框组件
    export default {
        name: "select-module",
        props: ["tag", "placeholder", "width","isDisabled","valueData","existTrace", "multiple"],
        data() {
            return {
                myValue: "",//this.valueData?this.valueData:""
                orglist: [],
                props: {
                    label: 'name',
                    children: 'childOrgan',
                    value: 'id',
                    checkStrictly: true,
                    multiple: false
                },
                orglevel: null,
                orgLevelShow: "",
            };
        },
        mounted() {
            this.gettree();
        },
        watch: {
          // valueData(val){
          //   if(val!=""){
          //     this.myValue = val;
          //   }else{
          //     this.myValue = "";
          //   }
          // }
        },
        methods: {
            change() {
                let idstr = [];
                idstr.push(this.myValue[this.myValue.length-1])
                this.$emit("input", idstr.join(","));
            },
            gettree() {
              if(this.existTrace){
                this.props.value = 'code';
              }else{
                this.props.value = 'id';
              }
              if(this.multiple){
                this.props.multiple = true;
                this.props.checkStrictly = false;
              }
              fetchTraceOrgan().then(response => {
                if (response.code == 0) {
                  this.orgLevelShow = response.data[0].level=='1'?true:false;
                  this.$emit('func',this.orgLevelShow)
                  this.orglist = response.data;
                }
              })
            },
            // treeData(data) {
            //     let cloneData = JSON.parse(JSON.stringify(data)); // 对源数据深度克隆
            //     // console.log(data, "data");
            //     let maxLevel = data[0].level;
            //     data.forEach(function (i, v) {
            //         if (maxLevel > v.level) {
            //             maxLevel = v.level;
            //             return;
            //         }
            //     })
            //     // console.log(maxLevel, 'level')
            //     let tree = cloneData.filter(father => {
            //         //循环所有项
            //         let branchArr = cloneData.filter(child => {
            //             return father.id == child.parentId; //返回每一项的子级数组
            //         });
            //         if (branchArr.length > 0) {
            //             father.children = branchArr; //如果存在子级，则给父级添加一个children属性，并赋值
            //         }
            //         return father.level == maxLevel; //返回第一层
            //     });
            //     // console.log(tree, 'tree')
            //     return tree; //返回树形数据
            // },
        }
    };
</script>

<style lang='scss' scoped>
    .search {
        margin-right: 20px;

        .tag {
            display: inline-block;
            vertical-align: top;
        }
    }

    .el-tag {
        background: #ffffff;
        border: 1px solid #dcdfe6;
    }
</style>